import {
	getToplist,
	getPlaylistDetail
} from "@/api/api.js"
export default {
	data() {
		return {
			list: [],
			top_detail: {},
			poster: ''
		}
	},
	onLoad() {
		this.init();
	},
	methods: {
		async init() {
			let top = await getToplist();
			this.list = top.list.splice(0, 10);
			let data = {
				id: this.list[0].id
			};
			let topDetail = await getPlaylistDetail(data);
			this.top_detail = topDetail.playlist;
			this.poster = this.top_detail.tracks[0].al.picUrl;
			this.formatTracks(topDetail.playlist);
		},
		async tabClick(e) {
			let data = {
				id: e.id
			};
			let topDetail = await getPlaylistDetail(data);
			this.top_detail = topDetail.playlist;
			this.poster = this.top_detail.tracks[0].al.picUrl;
			this.formatTracks(topDetail.playlist);
		},
		formatTracks(data) {
			let myTracks = data.tracks.splice(0, 10);
			this.$set(this.top_detail, 'my_tracks', myTracks);
			for (let j = 0; j < myTracks.length; j++) {
				let artists = "";
				myTracks[j].ar.map(it => {
					artists += `${it.name}/`;
				});
				this.$set(this.top_detail.my_tracks[j], 'my_ar', artists.slice(0, artists.length - 1));
			}
		},
		goPlayList() {
			const url = `/pages/playlist/playlist?id=${this.top_detail.id}`;
			this.$navigateTo(url);
		}
	}
}
